<script setup lang="ts">
import { onMounted } from 'vue'
import { useHospitalStore } from '@/stores'
import { useRoute } from 'vue-router'

const route = useRoute()
const hospitalStore = useHospitalStore()
onMounted(() => {
  hospitalStore.getHospitalInfo(route.query.hoscode as string)
  hospitalStore.getDepartmentList(route.query.hoscode as string)
})
</script>

<template>
  <div class="hospital">
    <el-row>
      <el-col :span="3" class="left" :xs="0">
        <!-- 面包屑 -->
        <el-breadcrumb separator="/">
          <el-breadcrumb-item :to="{ path: '/' }"
            ><el-icon><House /></el-icon
          ></el-breadcrumb-item>
          <el-breadcrumb-item>{{ $route.matched[2].name }}</el-breadcrumb-item>
        </el-breadcrumb>
        <!-- 菜单组件 -->
        <el-menu router :default-active="$route.fullPath">
          <el-menu-item
            :index="`/hospital/register?hoscode=${$route.query.hoscode}`"
            ><el-icon><Calendar /></el-icon>预约挂号</el-menu-item
          >
          <el-menu-item
            :index="`/hospital/detail?hoscode=${$route.query.hoscode}`"
            ><el-icon><Document /></el-icon>医院详情</el-menu-item
          >
          <el-menu-item
            :index="`/hospital/notice?hoscode=${$route.query.hoscode}`"
            ><el-icon><Bell /></el-icon>预约须知</el-menu-item
          >
          <el-menu-item
            :index="`/hospital/close?hoscode=${$route.query.hoscode}`"
            ><el-icon><Warning /></el-icon>停诊信息</el-menu-item
          >
          <el-menu-item
            :index="`/hospital/search?hoscode=${$route.query.hoscode}`"
            ><el-icon><Search></Search></el-icon>查询/取消</el-menu-item
          >
        </el-menu>
      </el-col>
      <el-col :span="1"></el-col>
      <el-col :span="20" class="right" :xs="24">
        <router-view></router-view>
      </el-col>
    </el-row>
  </div>
</template>

<style lang="scss" scoped></style>
